<template>
  <div>
    <el-dialog
      :title="title"
      :visible="viewDialog"
      :before-close="changeDialog"
      width="60%"
    >
      <div class="font">
        <span class="font_1">分账商户出款编号：</span>
        <span>{{ params.beginMmo }}</span>
      </div>
      <div class="font">
        <span class="font_1">分账出款商户名称： </span>
        <span>{{ params.stationName }}</span>
      </div>
      <div class="font">
        <span class="font_1">所属油企名称：</span>
        <span>{{ params.enterpriseName }}</span>
      </div>
      <div class="font">
        <span class="font_1">最大分账比例： </span>
        <span>{{ params.maxPercentage }}%</span>
      </div>
      <div class="font">分账信息：</div>
      <el-table border :data="params.divideAccountsList || []">
        <el-table-column
          property="mmoName"
          label="收款名称"
        ></el-table-column>
        <el-table-column
          property="mmo"
          label="收款账户"
        ></el-table-column>
        <el-table-column
          v-if="type == 'rule'"
          property="status"
          label="分账模式"
        >
      <template slot-scope="{row}">{{ row.status == 0 ? '比例' : '其他' }}</template>
      </el-table-column>
        <el-table-column
          v-if="type == 'rule'"
          property="percentage"
          label="分账值(%)"
        >
        <template slot-scope="{row}">
            {{ Number(row.percentage).toFixed(2) }}
          </template>
        </el-table-column>
        <el-table-column
          v-if="type == 'details'"
          property="amount"
          label="分账收款金额"
        >
      <template slot-scope="{row}">￥{{ row.amount }}</template>
      </el-table-column>
        <!-- <el-table-column
          v-if="type == 'details'"
          property="address"
          label="分账流水号"
        ></el-table-column> -->
        <el-table-column property="divideTxt" label="分账描述"></el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer">
        <el-button @click="changeDialog">关闭</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
export default {
  name: "ViewForm",
  props: {
    params: {
      default: () => {},
      type: Object,
    },
    viewDialog: {
      type: Boolean,
      default: false,
    },
    type: {
      type: String,
      default: "details",
    },
  },
  data() {
    return {
      title: "查看",
    };
  },
  methods: {
    // 关闭弹窗
    changeDialog() {
      this.$emit("changeDialog");
    },
  },
};
</script>
<style lang="scss" scoped>
.font {
  font-weight: 500;
  color: #000;
  margin-bottom: 20px;
}
.font_1 {
  display: inline-block;
  width: 9rem;
}
</style>
